<!doctype>
<html>
  <head>
    <meta charset=utf8>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.12.2/react-with-addons.js"></script>
  </head>
  <body>
    <h1>Testing version 0.12.2</h1>
    <div id="container">Will be replaced</div>
    <script>
      var node = document.getElementById('container');
      parent.React = React;
      var App = React.createClass({
        displayName: 'Things are great',
        getInitialState: function() {
          return {awesome: true};
        },
        onClick: function() {
          this.setState({awesome: !this.state.awesome});
        },
        render: function() {
          return React.createElement('div', {onClick: this.onClick},
          'Awesome sauce',
          this.state.awesome + ': awesome',
          React.createElement('span', null,
          'Nesting',
          this.state.awesome && React.createElement('span', {style: {color: 'red'}}, 'Things')),
          React.createElement(Sub));
        },
      });
      var Sub = React.createClass({
        render: function() {
          return React.createElement('div', null, 'Some things');
        },
      });
      React.render(React.createElement(App), node);
  </script>
</body>
</html>
